<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="body">
            <h:form id="cidadaoForm" enctype="multipart/form-data">
                <br/>
                <h3 class="title">Atualizar Cidadão</h3>
                <p:growl id="messages" showDetail="true" autoUpdate="true"  /> 
                <p:panel id="personPanel" style="background: none; border: none;" 
                         styleClass="container_24 clearfix both ">
                    <h4 class="title">Dados Gerais</h4>

                    <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText" />
                    <p:inputText id="nomeInputText" styleClass="grid_19" required="true" requiredMessage="O nome é Obrigatório" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.nome }" />

                    <p:outputLabel value="Cartão SUS:" styleClass="grid_3" for="cartaoInputText" />
                    <p:inputText id="cartaoInputText" styleClass="grid_8" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.numeroCartaoSus }" />
                    <!--                    <div class="clear"/>-->
                    <p:outputLabel value="Apelido:" style="left: -1%" styleClass="grid_3 " for="apelidoInputText" />
                    <p:inputText id="apelidoInputText" styleClass="grid_8" style="left: -1%" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.apelido }" />

                    <div class="clear"/>
                    <p:outputLabel value="Sexo:" styleClass="grid_3" for="sexoOneMenu" />
                    <div class="grid_8">
                        <p:selectOneMenu id="sexoOneMenu" 
                                         value="#{ managerEditarCidadao.cidadaoEditar.sexo }" >
                            <f:selectItems value="#{ managerEditarCidadao.sexo() }" />
                        </p:selectOneMenu>
                    </div>
                    <!--                     <div class="clear"/>-->
                    <p:outputLabel value="Cor:" styleClass="grid_3" for="corOneMenu" />
                    <div class="grid_8">
                        <p:selectOneMenu id="corOneMenu" 
                                         value="#{ managerEditarCidadao.cidadaoEditar.racaCor }" >
                            <f:selectItems value="#{ managerEditarCidadao.racaCor() }" />
                        </p:selectOneMenu>
                    </div>
                    <p:outputLabel value="Nome Mãe:" styleClass="grid_3" for="nomeMaeInputText" />
                    <p:inputText id="nomeMaeInputText" styleClass="grid_19" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.nomeMae }" />
                    <p:outputLabel value="Situação:" styleClass="grid_3" for="situacaoOneMenu" />
                    <div class="grid_8">
                        <p:selectOneMenu id="situacaoOneMenu" 
                                         value="#{ managerEditarCidadao.cidadaoEditar.situacaoConjugal }" >
                            <f:selectItems value="#{ managerEditarCidadao.situacaoConjugal() }" />
                        </p:selectOneMenu>
                    </div>
                    <p:outputLabel value="Contato:" styleClass="grid_3" for="contatoInputText" />
                    <p:inputMask mask="99-9999-9999" id="contatoInputText" styleClass="grid_8" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.telefone }" />
                </p:panel>
                <p:panel id="docPanel" style="background: none; border: none;" 
                         styleClass="container_24 clearfix both ">
                    <h4 class="title">Documento Pessoais</h4>

                    <p:outputLabel value="CPF:" styleClass="grid_3" for="cpfInputText" />
                    <p:inputMask mask="999.999.999-99" id="cpfInputText" styleClass="grid_8" 
                                 value="#{ managerEditarCidadao.cidadaoEditar.cpf }" />
                    <p:outputLabel value="Data Nasc.:" styleClass="grid_3 dataNascLabelImovel" for="dataNascCalendar" 
                                   />

                    <p:calendar id="dataNascCalendar" styleClass="grid_8"
                                showOn="both" locale="pt" yearRange="1900:2020" 
                                navigator="true" pattern="dd/MM/yyyy"
                                value="#{ managerEditarCidadao.cidadaoEditar.dataNascimento }"/>
                    <p:outputLabel value="RG:" styleClass="grid_3" for="rgInputText" />
                    <p:inputText  id="rgInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.rg }" />
                    <p:outputLabel value="O. Emissor:" styleClass="grid_3" for="emissorInputText" />
                    <p:inputText  id="emissorInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.orgaoEmissor }" />
                    <p:outputLabel value="Pis Pasep:" styleClass="grid_3" for="pisInputText" />
                    <p:inputText  id="pisInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.pisPasep }" />


                </p:panel>
                <p:panel id="infoPanel" style="background: none; border: none;" 
                         styleClass="container_24 clearfix both ">
                    <h4 class="title">Outras Informações</h4>
                    <p:outputLabel value="Ocupação:" styleClass="grid_3" for="ocupacaoInputText" />
                    <p:inputText  id="ocupacaoInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.ocupacao }" />
                    <p:outputLabel value="Local Trabalho:" styleClass="grid_3" for="trabalhoInputText" />
                    <p:inputText  id="trabalhoInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.localTrabalho }" />
                    <p:outputLabel value="Email:" styleClass="grid_3" for="emailInputText" />
                    <p:inputText  id="emailInputText" styleClass="grid_8" 
                                  value="#{ managerEditarCidadao.cidadaoEditar.email }" />

                </p:panel>

                <br/>
                <div class="buttonAction">
                    <p:commandButton value="Salvar" icon="ui-icon-disk"
                                     update="@form" 
                                     actionListener="#{managerEditarCidadao.atualizar()}"
                                     styleClass="ui-priority-primary" />

                    <p:button href="pesquisarcidadao.xhtml" value="Cancelar"  icon="ui-icon-trash" />
                </div >
            </h:form>
        </ui:define>
    </ui:composition>

</html>
